<template>
  <d2-container class="page">
    <h1 class="title"></h1>
    <img class="content_img" :src="content_img" alt="背景图片">
  </d2-container>
</template>

<script>
import img from './image/content_img.jpg'
import util from '@/libs/util'

export default {
  data () {
    return {
      content_img: img,
    }
  },
  mounted() {
    this.openWs()
  },
  methods: {
    openWs(){
      if (util.cookies.get('sh') == 1) {
        //创建socketSocket和监听ws代码
        let ws = new WebSocket(`ws://${process.env.VUE_APP_API}/yydcpc/websocket/` + util.cookies.get('uuid'));
        ws.onmessage = (evt) => {
          let received_msg = evt.data;
          console.log(received_msg);
          let url = 'http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=5&text=' + encodeURI(received_msg);
          let isChrome = /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
          if (!isChrome) {
            let n = new Audio(url);
            n.src = url;
            n.play();
          } else {
            let n = new Audio(url);
            n.src = url;
            n.play();
          }
        };
      }
		}
  },
}
</script>

<style lang="scss" scoped>
.page {
  position: relative;
  .content_img {
    width: 100%;
    height: 100%;
  }
  .title {
    position: absolute;
    top: 30%;
    left: 30%;
    color: #fff;
  }
}
</style>
